import React, { useRef, useState, useEffect } from 'react';
// styles
import styles from './index.less';
// 自定义组件

export default () => {
  // 清除图层
  const clearFun = () => {
    window?.LFTViewer?.setLFTAllData(
      [
        {
          type: 'ctrl',
          payload: [
            {
              ctrl: 'clearLayer',
              groupId: 'MapGroup',
              layerId: 'textLayer',
            },
          ],
        },
      ],
      () => {
        console.log('清除完成了');
      },
    );
  };
  // 绘制图层
  const drawFun = () => {
    window?.LFTViewer?.setLFTAllData(
      [
        {
          type: 'draw',
          payload: [
            {
              groupId: 'MapGroup',
              layerId: 'textLayer',
              payload: [
                {
                  positions: [39, 116.4327],
                  overlayType: 'Point',
                  label: 'ss1s',
                  payload: {},
                },
                {
                  positions: [30, 116.4327],
                  overlayType: 'Point',
                  label: 'sss',
                  payload: {},
                },
              ],
            },
          ],
        },
      ],
      () => {},
    );
  };
  useEffect(() => {
    // console.log('viewer', window.LFTViewer);

    window?.LFTViewer?.setLFTAllData(
      [
        {
          type: 'ctrl',
          payload: [
            {
              ctrl: 'createLayer',
              groupId: 'MapGroup',
              layerId: 'textLayer',
            },
          ],
        },
      ],
      () => {
        // console.log('创建完成了');
        drawFun();
      },
    );
    return () => {
      clearFun();
    };
  }, []);
  return <></>;
};
